<template>
  <div class="container">
    <nav-bar title="微信登录" />
    <div class="tips">
      <img src='../../assets/img/wechat-w.png' />
      <p>该网页由TITIKA开发，向其提供以下权限即可继续操作</p>
    </div>
    <div class="agree">
      <input type="checkbox" checked="checked" />
      获得你的公开信息(昵称、头像等)
    </div>
    <div class="btn" @click="loginByWechat">确认绑定</div>
  </div>
</template>

<script>
import NavBar from 'components/common/NavBar'
import { Toast } from 'vant'
import { loginOrBindUser } from '../../network/user'

const {
  EVN,
  productionDomain,
  natDomain,
} = require("../../config/global.js")

export default {
  methods: {
    loginByWechat(){
      this.authWx()
      
      // Toast('绑定成功')
      // setTimeout(() => {
      //   this.$router.push({
      //     path: '/userBase'
      //   })
      // }, 2000)
    },
    authWx(){
      // 根据code获取openid，绑定微信账号
      let code = getQueryString('code')
      if(code){
        request({
          url: "api/Wx/GetUser",
          params: { code },
        }).then((res) => {
          if (res.data.Success) {
            let wxData = res.data.Data
            wxData.nickname = filterEmoji(wxData.nickname) // 去除微信昵称中的表情符号

            console.log(wxData)
            // 绑定微信账号
            // this.bindWechat(wxData)
          } else {
            console.log("获取微信用户信息失败...")
            this.getCode()
          }
        })
      } else {
        this.getCode()
      }
    },
    bindWechat(wxData){
      if(!wxData){
        console.log('请同意微信授权后绑定')
        return false
      }
      
      let requestData = {
        userName: localStorage.getItem('phone'),
        password: localStorage.getItem('phonePassword'),
        oauthType: 'Himall.Plugin.OAuth.WeiXin',
        oauthOpenId: wxData.openid,
        unionid: wxData.unionid,
        headimgurl: wxData.headimgurl,
        oauthNickName: wxData.nickname,
        sex: wxData.sex,
        city: wxData.city,
        province: wxData.province,
      }
      console.log('binding', requestData)
      // return false

      // loginOrBindUser(this, requestData, () => {
        
      // })

      // request({
      //   url: 'api/Login/GetUser',
      //   params: requestData
      // }).then(async res => {
      //   if(res.data.Data.success){
      //     console.log('绑定微信号成功')
      //     // 获取payment
      //     try {
      //       await this.getWechatPay()
      //       this.btnActive = true
      //     } catch (error) {
      //       console.log('catch error: ', error)
      //     }
      //   } else {
      //     Toast('请绑定微信账号') // res.data.Msg
      //   }
      // })
    },
    getCode(){
      let redirectUrl = location.href
        let restUrl = redirectUrl.substr(redirectUrl.indexOf("#/loginWechat"))
        
        redirectUrl =
          EVN === "development"
            ? `${natDomain}${restUrl}`
            : `${productionDomain}Images/dist/${restUrl}`

        let snsapi =
            "https://open.weixin.qq.com/connect/oauth2/authorize?appid=" +
            wxAppId +
            "&redirect_uri=" +
            encodeURIComponent(redirectUrl) +
            "&response_type=code&scope=snsapi_userinfo"

        location.href = snsapi
    },
  },
  components: {
    NavBar
  }
}
</script>

<style scoped>
.tips{
  text-align: center;
  font-size: 14px;
  color: #ffffff;
  padding: 30px 30px;
  background: rgb(12, 211, 128);
}
.tips img{
  width: 100px;
}
.agree{
  position: relative;
  padding: 15px 25px 50px 25px;
  font-size: 14px;
  color: #666666;
}
.agree:after{
  position: absolute;
  top: 21px;
  left: 28px;
  content: '';
  display: block;
  width: 3px;
  height: 6px;
  border-bottom: 1px solid #999;
  border-right: 1px solid #999;
  transform: rotate(45deg)
}
.agree input{
  width: 10px;
  height: 10px;
  border-radius: 3px;
  background: #ffffff;
}
.btn{
  color: #ffffff;
  border-radius: 3px;
  border: none;
  margin: 0 25px;
  background-color: rgb(12, 211, 128);
}
</style>